<template>
    <div class="container">
        <div class="cause">请选择投诉原因</div>
        <div class="complain-reason" @click="jubao">
            <div class="reason">
                <span>网页包含欺诈信息(如：假红包)</span><i class="iconfont icon-arrow-right"></i>
            </div>
            <div class="reason">
                <span>网页包含色情信息</span><i class="iconfont icon-arrow-right"></i>
            </div>
            <div class="reason">
                <span>网页包含暴力恐怖信息</span><i class="iconfont icon-arrow-right"></i>
            </div>
            <div class="reason">
                <span>网页保护政治敏感信息</span><i class="iconfont icon-arrow-right"></i>
            </div>
            <div class="reason">
                <span>网页在收集个人隐私(如：钓鱼链接)</span><i class="iconfont icon-arrow-right"></i>
            </div>
            <div class="reason">
                <span>网页包含诱导分享/关注性质的内容</span><i class="iconfont icon-arrow-right"></i>
            </div>
            <div class="reason">
                <span>网页可能包含谣言信息</span><i class="iconfont icon-arrow-right"></i>
            </div>
            <div class="reason">
                <span>网页包含赌博信息</span><i class="iconfont icon-arrow-right"></i>
            </div>
        </div>
        <a href="https://weixin110.qq.com/security/readtemplate?t=w_security_center_website/report_agreement&amp;lang=zh_CN">投诉须知</a>
    </div>
</template>

<script>
    export default {
        name: "tousu",
        created:function () {
            this.$emit('set','hide')
        },
        methods:{
            jubao(){
                this.$router.push({path:'/tousu2'})
            }
        }
    }
</script>

<style scoped>
    body{
        margin: 0px;
    }
    .container{
        width: 100%;
        height: 100vh;
        background: #EDEDED;
        position: relative;
        margin-bottom: 0px;
    }
    .cause{
        padding: 8px 13px;
        color: #999;
        font-size: 0.9rem;
    }
    .complain-reason{
        background: white;
        padding-left: 13px;
    }
    .complain-reason div:nth-last-child(1){
        border-bottom: none;
    }
    .reason{
        border-bottom: 1px solid gainsboro;
        display: flex;
        justify-content: space-between;
        padding: 10px 0px;
        padding-right: 10px;
    }
    .iconfont{
        font-size: 1.2rem;
    }
    .container a{
        position: absolute;
        bottom: 10px;
        width: 100%;
        text-align: center;
        text-decoration: none;
    }
</style>
